<template>
  <div class="app-container">
    <el-form :inline="true" class="demo-form-inline">
      <el-form-item label="余额强杀概率">
        <el-input v-model="rate" placeholder="全自动强杀概率">
          <template slot="append">%</template>
        </el-input>
      </el-form-item>
      <el-button type="primary" @click="onSubmit">设置</el-button>

      <el-form-item label="保险仓强杀概率" style="margin-left: 50px;">
        <el-input v-model="rate2" placeholder="保险仓强杀概率">
          <template slot="append">%</template>
        </el-input>
      </el-form-item>
      <el-button type="primary" @click="onSubmit2">设置</el-button>
    </el-form>
    <div style="display: flex; align-items: flex-start; justify-content: space-between;">
      <div>
        <div style="display: flex; align-items: center;">
          <p>btc当前状态：</p>
          <el-tag v-if="btc == 'unKill'">待强杀 </el-tag>
          <el-tag v-if="btc == 'killing'">强杀中</el-tag>
          <el-tag v-if="btc == 'sync'">同步中</el-tag>
          <p style="margin-left:  15px;">btc: {{ btcPrice }}</p>
        </div>
        <div style="display: flex; align-items: center;">
          <p>eth当前状态：</p>
          <el-tag v-if="eth == 'unKill'">待强杀</el-tag>
          <el-tag v-if="eth == 'killing'">强杀中</el-tag>
          <el-tag v-if="eth == 'sync'">同步中</el-tag>
          <p style="margin-left:  15px;">eth: {{ ethPrice }}</p>
        </div>
      </div>
      <div style="margin-left: 50px;">
        <div style="display: flex; align-items: center;height: 32px;">
          <p style="width: 200px;">今日强杀局数：{{ statistics.todayKillRecords }}</p>
          <p style="width: 200px;">自动强杀局数：{{ statistics.todayAutoKillRecords }}</p>
          <p style="width: 200px;">手动强杀局数：{{ parseInt(statistics.todayKillRecords - statistics.todayAutoKillRecords) }}
          </p>

        </div>
        <div style="display: flex;height: 32px;align-items: center;">
          <p style="width: 200px;">今日强杀总金额：{{ statistics.todayKillAmount }}</p>
          <p style="width: 200px;">历史强杀总金额：{{ statistics.historyKillAmount }}</p>
        </div>
      </div>

    </div>

    <el-table v-loading="listLoading" :data="list" element-loading-text="Loading" border fit highlight-current-row>

      <el-table-column label="用户ID" align="center" prop="userId" />
      <el-table-column label="用户名" align="center" prop="nickName" />
      <el-table-column label="下注类型" align="center" prop="gameType">
        <template slot-scope="scope">
          {{ setaType(scope.row.gameType) }}
        </template>
      </el-table-column>
      <el-table-column label="下注金额" align="center" prop="betAmount" />
      <el-table-column label="是否被强杀" align="center">
        <template slot-scope="scope">
          {{ scope.row.isMustKill == 1 ? '是' : '否' }}
        </template>
      </el-table-column>
      <el-table-column label="下注时间" align="center" prop="createTime">
        <template slot-scope="scope">
          {{ setFormatTime(scope.row.createTime, 'HH:mm:ss') }}
        </template>
      </el-table-column>

      <el-table-column label="下注涨/跌" align="center" prop="betCommand" />
      <el-table-column label="下注时大盘价" align="center" prop="betStockPrice" />
      <el-table-column label="下注是否使用保险仓" align="center">
        <template slot-scope="scope">
          {{ scope.row.isUseInsuranceBalance == 0 ? '否' : '是' }}
        </template>
      </el-table-column>
      <el-table-column label="投注状态" align="center" prop="today">
        <template slot-scope="scope">
          {{ scope.row.isCheckout == 0 ? '投注中 ' + (20 - scope.row.openTime) + 's/20s' : '已结束 盈亏' + scope.row.winAmount
          }}
        </template>
      </el-table-column>

      <el-table-column label="操作" align="center" prop="teamRate">
        <template slot-scope="scope">
          <el-button v-if="getState(scope.row)" type="text" @click="qs(scope.row)">强杀</el-button>
        </template>
      </el-table-column>
    </el-table>
    <audio ref="audio" class="aud">
      <source src="@/assets/dingdingvoice.mp3">
    </audio>
  </div>
</template>
<script>
import { kill, getKillRate, setKillRate, statisticsKill, getInsuranceKillRate } from '@/api/table'
export default {
  data() {
    return {
      socket: null,
      listLoading: true,
      list: [],
      btc: null,
      eth: null,
      btcPrice: 0,
      ethPrice: 0,
      saveId: null,
      rate: '',
      statistics: null,
      rate2: ''
    }
  },

  mounted() {
    this.connectWebSocket()
    this.getRate()
    this.getKill()
    this.getIns()
  },
  beforeDestroy() {
    console.log('撒娇的反抗撒旦发生')
    this.socket.close()
  },
  methods: {
    async getRate() {
      const res = await getKillRate()
      this.rate = res.data
    },
    async onSubmit() {
      await setKillRate({ rate: this.rate, type: 0 })
      this.$message.success('操作成功')
      this.getRate()
    },
    async onSubmit2() {
      await setKillRate({ rate: this.rate2, type: 1 })
      this.$message.success('操作成功')
      this.getIns()
    },
    async getKill() {
      const res = await statisticsKill()
      this.statistics = res.data
    },
    async getIns() {
      const res = await getInsuranceKillRate()
      this.rate2 = res.data
    },
    getState(record) {
      if (record.openTime && record.openTime > 7) {
        if (record.gameType === 7 || record.gameType === 8) {
          if (record.gameType === 7 && this.btc === 'unKill') {
            return true
          }
          if (record.gameType === 8 && this.eth === 'unKill') {
            return true
          }
          return false
        } else {
          return true
        }
      } else {
        return false
      }
    },
    // 4：道琼斯；5：恒生指数；6：黄金；7：比特币；8：以太坊
    setaType(index) {
      let str = ''
      switch (Number(index)) {
        case 4:
          str = '道琼斯'
          break
        case 5:
          str = '恒生指数'
          break
        case 6:
          str = '黄金'
          break
        case 7:
          str = '比特币'
          break
        case 8:
          str = '以太坊'
          break
      }
      return str
    },
    setFormatTime(index, format) {
      // 2024-10-07 12:03:27
      console.log(index.length)
      return index.split(' ')[1]
    },
    play() {
      let music1 = new Audio()
      music1 = require('@/assets/dingdingvoice.mp3')
      this.$refs.audio.src = music1
      this.$refs.audio.play()
    },
    async qs(record) {
      await kill({ id: record.id })
      this.$message.success('操作成功')
    },
    connectWebSocket() {
      this.socket = new WebSocket('ws://socket.wkrich.co/websocket?bizType=admin_kill&token=admin_kill')
      this.socket.addEventListener('open', () => {
        console.log('WebSocket connected')
      })

      this.socket.addEventListener('close', () => {
        console.log('WebSocket disconnected')
      })

      this.socket.addEventListener('message', (event) => {
        const message = JSON.parse(event.data)
        this.list = message.data.userBets
        if (this.saveId) {
          if (this.saveId !== this.list[0].id) {
            this.play()
            this.saveId = this.list[0].id
          }
        } else {
          this.saveId = this.list[0].id
        }

        this.btc = message.data.btcStatus
        this.eth = message.data.ethStatus
        this.btcPrice = JSON.parse(message.data.btcStock).price
        this.ethPrice = JSON.parse(message.data.ethStock).price
        this.listLoading = false
        // console.log(this.list)
        // 处理收到的消息
      })
    }

  }
}
</script>
<style lang="scss" scoped>
p {
  margin: 0;
}

.app-container {
  padding: 15px;
}
</style>
